            * {
                padding: 0px;
                margin: 0px;
                list-style: none;
            }
            /* a:hover{
    color: white;
} */
            /* 头部上 */
            
            header {
                height: 14.4rem;
                background: pink;
                width: 100%;
            }
            
            .header-head {
                height: 5rem;
                background: #231f20;
                width: 100%;
                /* overflow: hidden; */
                position: relative;
            }
            
            .header-head-a {
                display: flex;
                justify-content: center;
                align-items: center;
                color: white;
                position: absolute;
                justify-content: center;
                left: 0px;
                right: 0px;
                top: 15px;
            }
            
            .header-head-a span {
                font-size: 1.4rem;
                padding: 5px 20px 5px 20px;
                letter-spacing: 0.0001rem;
                text-decoration: underline;
            }
            
            @media (max-width:440px) {
                .header-head-a span {
                    font-size: 1.2rem;
                }
                .navbar-brand {
                    display: none;
                }
            }
            
            .header-head-a span strong {
                font-weight: bold;
            }
            
            .header-head-a:hover {
                color: white;
            }
            
            .logo-npm {
                padding-top: 5px;
                width: 60px;
            }
            /* 头部中 */
            
            .header-center {
                height: 62px;
                width: 100%;
                background: green;
                border-top-width: 10px;
                border-top-style: solid;
                border-top-color: red;
                border-image: linear-gradient(139deg, rgb(251, 136, 23), rgb(255, 75, 1), rgb(193, 33, 39), rgb(224, 42, 255));
                border-image-slice: 1;
                font-size: 14px;
                text-align: center;
            }
            
            .bg-light {
                background-color: white!important;
            }
            
            .love {
                color: black;
                padding-right: 16px;
                padding-left: 20px;
                font-family: initial;
                font-size: 20px;
                cursor: pointer;
                transition: all 0.3s;
            }
            
            .love:hover {
                color: #7c7272;
            }
            
            .navbar-brand {
                font-family: 'Poppins';
                color: #000;
                font-size: 14px;
                cursor: pointer;
                transition: all 0.3s;
            }
            
            .navbar-brand:hover {
                color: #888181!important;
            }
            
            .dropdown-toggle::after {
                display: none;
            }
            
            .dropdown-menu {
                box-shadow: 0 0 4px 2px rgba(0, 0, 0, .2);
                min-width: 6.5rem;
                border: 0px;
                font-family: 'Poppins';
            }
            
            .dropdown-item {
                padding-left: 1rem;
                padding-right: 1rem;
            }
            
            .navbar-expand-lg .navbar-nav .nav-link {
                padding-right: 1rem;
                padding-left: 1rem;
                font-family: 'Poppins';
            }
            
            .bg-light {
                z-index: 11;
                border-bottom: 1px solid #cccccc;
            }
            
            .dropdown-item {
                font-family: 'Poppins';
                color: #000;
                font-size: 14px;
                cursor: pointer;
                transition: all 0.3s;
                background: white;
                transition: all 0.3s;
            }
            
            .dropdown-item:hover {
                background: white;
                color: rgb(175, 166, 175);
            }
            
            .nav-link {
                color: black!important;
                transition: all 0.4s;
            }
            
            .nav-link:hover {
                color: #aaa4a4!important;
            }
            /* 头部下 */
            
            .header-bottom {
                height: 88px;
                width: 100%;
                background: white;
                display: flex;
                align-items: center;
                border-bottom: 1px solid #cccccc;
            }
            
            h1 {
                float: left;
                margin-left: 30px;
            }
            
            h1 svg {
                width: 70px;
            }
            
            .header-bottom-center {
                height: 50px;
                width: 100%;
            }
            
            .nav {
                float: left;
            }
            
            .header-bottom form {
                display: flex;
                height: 50px;
                background: #F2F2F2;
            }
            
            .sign-up {
                height: 50px;
                background-color: white;
                line-height: 50px;
                border: 1px solid #cccccc;
                font-size: 15px;
                font-family: 'Poppins';
                padding-left: 5px;
                padding-right: 5px;
                text-align: center;
            }
            
            .sign-in {
                height: 50px;
                line-height: 50px;
                font-size: 15px;
                font-family: 'Poppins';
                padding-left: 5px;
                padding-right: 5px;
                text-align: center;
            }
            
            .sign-up a {
                color: black;
                text-decoration: none;
                transition: all 0.3s;
            }
            
            .sign-up a:hover {
                color: #beb8b8;
            }
            
            .sign-in a {
                color: black;
                text-decoration: none;
                transition: all 0.3s;
            }
            
            .sign-in a:hover {
                color: #beb8b8;
            }
            
            .search-logo {
                display: flex;
                align-items: center;
                margin-left: 13px;
            }
            
            .search-logo svg {
                width: 40px;
                height: 20px;
            }
            
            .search-box {
                height: 50px;
                width: 100%;
                background-color: #F2F2F2;
            }
            
            .search-box input {
                display: flex;
                height: 50px;
                float: left;
                width: 100%;
                background-color: #F2F2F2;
                font-family: "Fira Mono", "Andale Mono", "Consolas", monospace;
                font-size: 16px;
                border: none;
            }
            
            .search-text {
                display: inline-block;
                width: 150px;
                height: 50px;
                text-align: center;
                line-height: 50px;
                background-color: black;
                color: white;
                font-family: 'Poppins';
                font-weight: bolder;
                border: none;
            }
            /* section */
            
            .section1 {
                background-image: url('../images/index1.png');
                width: 100%;
                background-position: center center;
                background-repeat: no-repeat;
                background-size: cover;
            }
            
            .section-center {
                margin: 0px auto;
                width: 60%;
                text-align: center;
                overflow: hidden;
                padding-top: 4rem;
                padding-bottom: 4rem;
            }
            
            .section-center-title {
                display: flex;
                font-family: Poppins, sans-serif;
                justify-content: center;
                font-weight: 600;
                font-size: 5rem;
                color: white;
                line-height: 1.25;
                text-align: center;
                margin-top: 0.67em;
                margin-bottom: 0.67em;
            }
            
            .section-center-top {
                display: flex;
                font-family: 'Arimo', sans-serif;
                line-height: 1.5;
                text-align: center;
                width: 70%;
                margin: 0px auto;
                color: white;
            }
            
            h2 {
                display: flex;
                font-family: Poppins, sans-serif;
                width: 70%;
                font-weight: 600;
                margin: 0px auto;
                color: white;
                font-size: 2.25rem;
                margin-top: 1.89rem;
                margin-bottom: 1.89rem;
            }
            
            .section-center-center {
                display: flex;
                font-family: 'Arimo', sans-serif;
                line-height: 1.5;
                text-align: center;
                width: 70%;
                margin: 0px auto;
                color: white;
            }
            
            .section-center-bottom {
                display: flex;
                margin: 0px auto;
                margin-top: 4rem;
                width: 70%;
                padding-bottom: 1rem;
            }
            
            .section-bottom {
                width: 50%;
                padding-right: 1rem;
            }
            .section-bottom a:hover{
              color: white;
          }
            
            .bottom-right {
                padding-right: 0px;
                padding-left: 1rem;
            }
            
            .section-center-bottom a {
                font-family: Poppins, sans-serif;
                color: white;
                text-align: center;
                text-decoration: none;
                font-weight: 700;
                background: #c12127;
                border-bottom: solid 5px #fa8717;
                display: inline-block;
                width: 100%;
                padding-top: 1rem;
                padding-bottom: 1rem;
            }
            
            .bottom-right a {
                background: #e81aa8;
                border-bottom: solid 5px #b30ad2;
            }
            
            @media (max-width:970px) {
                .section-center {
                    width: 89%;
                }
                .section-center-center {
                    width: 80%;
                }
                h2 {
                    font-size: 1.5rem;
                    width: 70%;
                }
            }
            
            @media (max-width:678px) {
                .section-center-top {
                    width: 90%;
                }
                .section-center-center {
                    width: 90%;
                }
                h2 {
                    width: 90%;
                    font-size: 1.5rem;
                }
            }
            
            @media(max-width:485px) {
                .section-bottom {
                    font-size: .78rem;
                }
            }
            
            .section2 {
                width: 100%;
                padding: 4rem 1rem 0rem 1rem;
            }
            
            .section2-center {
                width: 40%;
                margin: 0px auto;
                text-align: center;
                margin-bottom: 4rem;
            }
            
            @media(max-width:959px) {
                .section2-center {
                    width: 70%;
                }
            }
            
            @media(max-width:610px) {
                .section2-center {
                    width: 90%;
                }
            }
            
            .section2-center img {
                width: 109px;
                height: 96px;
            }
            
            .section2-center h2 {
                color: #333;
                width: 100%;
            }
            
            .section2-four {
                margin: 0px auto;
            }
            
            .section2-four li {
                display: inline-block;
                text-align: left;
                margin-bottom: 4rem;
            }
            
            .section2-four li img {
                width: 68px;
                height: 68px;
            }
            
            .section2-four li h3 {
                font-family: Poppins, sans-serif;
                font-weight: 600;
                font-size: 1rem;
                color: #333;
                margin: 16px 0px 16px 0px;
                line-height: 1.5;
            }
            
            .section2-four li p {
                font-size: .805rem;
                font-family: 'Arimo', sans-serif;
                line-height: 1.5;
                margin-bottom: 32px;
                color: #333;
            }
            
            .section2-four li a {
                display: inline-block;
                font-family: Poppins, sans-serif;
                text-decoration: none;
                color: black;
                border: 1px solid black;
                padding: .5rem 2rem .5rem 2rem;
                letter-spacing: .1em;
                border-radius: 99px;
                font-weight: 700;
            }
            
            @media(max-width:575px) {
                .section2-four li {
                    width: 50%;
                    margin: 0px auto;
                    text-align: center;
                    margin-bottom: 32px;
                }
            }
            
            @media(max-width:480px) {
                .section2-four li {
                    width: 90%;
                    margin: 0px auto;
                    text-align: center;
                    margin-bottom: 32px;
                }
            }
            /* section3 */
            
            .section3 {
                background-image: url("../images/index8.png");
                background-repeat: no-repeat;
                background-size: cover;
                padding: 4rem 1rem 4rem 1rem;
                color: white;
                width: 100%;
                height: 20rem;
            }
            
            .section3-top {
                width: 50%;
                margin: 0px auto;
                text-align: center;
                font-family: Poppins, sans-serif;
                font-weight: 600;
                font-size: 3rem;
            }
            
            .section3-bottom {
                width: 45%;
                margin: 0px auto;
                text-align: center;
                font-family: 'Arimo', sans-serif;
                line-height: 1.5;
                padding: 2rem 0rem 2rem 0rem;
            }
            
            @media(max-width:960px) {
                .section3 {
                    height: 17rem;
                    padding: 2rem 1rem 4rem 1rem;
                }
                .section3-top {
                    width: 60%;
                    font-size: 1.5rem;
                }
                .section3-bottom {
                    width: 70%;
                }
            }
            
            @media(max-width:650px) {
                .section3-bottom {
                    width: 90%;
                    font-size: .85rem;
                }
            }
            
            @media(max-width:430px) {
                .section3-top {
                    width: 90%;
                }
            }
            
            @media(max-width:300px) {
                .section3-top {
                    width: 100%;
                }
                .section3-bottom {
                    padding-top: .8rem;
                    font-size: .75rem;
                }
            }
            /* senction4 */
            
            .section4 {
                padding: 4rem 1rem 2rem 1rem;
                text-align: center;
            }
            
            .section4-text {
                display: flex;
                font-family: Poppins, sans-serif;
                width: 50%;
                font-weight: 600;
                font-size: 2.25rem;
                margin: 0px auto 4rem;
            }
            
            .section4 img {
                width: 32rem;
            }
            
            @media(max-width:960px) {
                .section4-text {
                    font-size: 1.5rem;
                    width: 32rem;
                }
            }
            
            @media(max-width:560px) {
                .section4-text {
                    width: 90%;
                }
                .section4 img {
                    width: 90%;
                }
            }
            /* footer */
            
            footer {
                width: 100%;
                padding: 1rem;
                border-bottom: 10px solid;
                border-image: linear-gradient(139deg, rgb(251, 136, 23), rgb(255, 75, 1), rgb(193, 33, 39), rgb(224, 42, 255));
                border-image-slice: 1;
                box-shadow: 0px -1px 1px #e5e5e5;
                margin-top: 4rem;
            }
            
            .row {
                margin-left: 0px;
            }
            
            footer div {
                padding: 2rem;
                font-family: 'Poppins';
                line-height: 2;
                font-weight: 400;
            }
            
            footer h3 {
                font-size: 17px;
                letter-spacing: 1.3px;
                color: #333333;
                font-weight: bolder;
            }
            
            footer ul {
                margin: 1rem 0rem 1rem 0rem;
            }
            
            .footer-img svg {
                width: 50px;
            }
            
            footer a {
                font-family: 'Poppins';
                color: rgba(0, 0, 0, 0.7);
                text-decoration: none;
            }
            
            a:hover {
                text-decoration: none;
                color: rgba(0, 0, 0, 0.7);
            }